﻿@namespace BootstrapBlazor.Components
@typeparam TItem
@inherits TableBase<TItem>

<div class="table-container" @ref="TableWrapper">
    <div class="table-toolbar">
        @if (ShowToolbar)
        {
            <TableToolbar TItem="TItem" OnGetSelectedRows="@GetSelectedRows">
                @if (ShowDefaultButtons)
                {
                    @if (ShowNewButton)
                    {
                        <TableToolbarButton TItem="TItem" Color="Color.Success" OnClick="@AddAsync" Icon="fa fa-plus" Text="新建" />
                    }
                    @if (ShowEditButton)
                    {
                        <TableToolbarButton TItem="TItem" Color="Color.Primary" OnClick="@EditAsync" Icon="fa fa-pencil" Text="编辑" />
                    }
                    @if (ShowDeleteButton)
                    {
                        <TableToolbarPopconfirmButton TItem="TItem" Color="Color.Danger" Icon="fa fa-remove" Text="删除"
                                                      OnBeforeClick="@ConfirmDelete" OnConfirm="@DeleteAsync"
                                                      CloseButtonText="取消" Content="确认要删除选中的所有行吗？"
                                                      ConfirmButtonText="删除" ConfirmButtonColor="Color.Danger" />
                    }
                }
                @TableToolbarTemplate
            </TableToolbar>
            @if (ShowRefresh)
            {
                <div class="float-right table-toolbar-button table-column-right">
                    <button class="btn btn-secondary" type="button" title="刷新" @onclick="@QueryAsync">
                        <i class="fa fa-refresh"></i>
                        <span class="d-none d-sm-inline-block">刷新</span>
                    </button>
                </div>
            }
        }
        @if (ShowSearch)
        {
            <div class="float-right table-toolbar-button btn-group">
                <div class="input-group">
                    <BootstrapInput TItem="string" class="table-toolbar-search" placeholder="搜索" @bind-Value="@SearchText" @onkeyup="@OnKeyUp">
                        <Tooltip Placement="Placement.Top" Title="@SearchTooltip" IsHtml="true" />
                    </BootstrapInput>
                    <div class="input-group-append">
                        <button class="btn btn-secondary" type="button" title="搜索" @onclick="@SearchClick">
                            <i class="fa fa-search"></i>
                            <span class="d-none d-sm-inline-block">搜索</span>
                        </button>
                        <button class="btn btn-secondary" type="button" title="清空过滤" @onclick="@ClearSearchClick">
                            <i class="fa fa-trash"></i>
                            <span class="d-none d-sm-inline-block">清空过滤</span>
                        </button>
                        @if (ShowAdvancedSearch)
                        {
                            <Button class="@AdvanceSearchClass" Icon="fa fa-search-plus" OnClickWithoutRender="@ShowSearchDialog">
                                <span class="d-none d-sm-inline-block">高级搜索</span>
                            </Button>
                        }
                    </div>
                </div>
            </div>
        }
    </div>

    <CascadingValue Value="this" IsFixed="true">
        <div class="@WrapperClassName" style="@WrapperStyleName">
            <table class="@ClassName">
                @TableColumns?.Invoke(HeaderModel)
                <colgroup>
                    @if (IsMultipleSelect)
                    {
                        @if (ShowCheckboxText)
                        {
                            <col width="80" />
                        }
                        else
                        {
                            <col width="36" />
                        }
                    }
                    <RenderTemplate>
                        @foreach (var col in Columns)
                        {
                            <col width="@col.Width" />
                        }
                    </RenderTemplate>
                    @if (ShowExtendButtons)
                    {
                        <col width="@ExtendButtonColumnWidth" />
                    }
                </colgroup>
                <tbody>
                    @if (Items != null)
                    {
                        @foreach (var item in Items)
                        {
                            @if (IsMultipleSelect)
                            {
                                <tr class="@GetRowClassString(item)" @onclick="@(e => ClickRow(item))">
                                    <td>
                                        <div class="table-cell">
                                            <Checkbox TValue="TItem" Value="@item" State="@RowCheckState(item)" OnStateChanged="@OnCheck"></Checkbox>
                                        </div>
                                    </td>
                                    @RenderRow(item)
                                </tr>
                            }
                            else
                            {
                                <tr class="@GetRowClassString(item)" @onclick="@(e => ClickRow(item))" @ondblclick="@(e => DoubleClickRow(item))">
                                    @RenderRow(item)
                                </tr>
                            }
                        }
                    }
                    else
                    {
                        <TableLoading IsMultipleSelect="@IsMultipleSelect" ShowExtendButtons="@ShowExtendButtons" />
                    }
                </tbody>
                <thead>
                    <tr>
                        @if (IsMultipleSelect)
                        {
                            <th class="@CheckboxColumnClass">
                                <div class="table-cell">
                                    <Checkbox TValue="TItem" @ref="@HeaderCheckbox" DisplayText="@CheckboxDisplayTextString" State="@HeaderCheckState()" OnStateChanged="@OnHeaderCheck" ShowAfterLabel="@ShowCheckboxText"></Checkbox>
                                </div>
                            </th>
                        }
                        <RenderTemplate>
                            @foreach (var col in Columns)
                            {
                                var fieldName = col.GetFieldName();
                                var displayName = col.GetDisplayName();
                                <th class="@GetHeaderClassString(col)" @onclick="@(e => OnSortClick(fieldName))">
                                    <div class="@GetHeaderWrapperClassString(col)">
                                        <span class="@GetHeaderTextClassString(col)">@displayName</span>
                                        @if (col.Filterable)
                                        {
                                            <i class="@GetFilterClassString(fieldName)" data-field="@fieldName" @onclick:stopPropagation @onclick="@(e => OnFilterClick(col))"></i>
                                        }
                                        @if (col.Sortable)
                                        {
                                            <i class="@GetIconClassString(fieldName)"></i>
                                        }
                                    </div>
                                </th>
                            }
                        </RenderTemplate>
                        @if (ShowExtendButtons)
                        {
                            <th class="@ButtonColumnClass">
                                <div class="table-cell is-button-column">
                                    @ColumnButtonTemplateHeaderText
                                </div>
                            </th>
                        }
                    </tr>
                </thead>
                @if (ShowFooter)
                {
                    <tfoot>
                        <tr>@TableFooter</tr>
                    </tfoot>
                }
            </table>
        </div>

        <RenderTemplate>
            @{
                if (FilterColumns == null) FilterColumns = Columns.Where(i => i.Filterable);
                if (FilterColumns.Any())
                {
                    <div class="table-filter">
                        @foreach (var col in FilterColumns)
                        {
                            <TableFilter Column="col" />
                        }
                    </div>
                }
            }
        </RenderTemplate>

        @if (TotalCount > 0 && IsPagination)
        {
            <div class="table-pagination">
                <Pagination PageItemsSource="@PageItemsSource" PageItems="@PageItems" TotalCount="@TotalCount" PageIndex="@PageIndex" OnPageClick="@OnPageClick" OnPageItemsChanged="@OnPageItemsChanged"></Pagination>
            </div>
        }
    </CascadingValue>
</div>

@code {
    RenderFragment<TItem> RenderRow => item =>
    @<RenderTemplate>
        @foreach (var col in Columns)
        {
            <td>
                <div class="@GetCellClassString(col)">
                    @GetValue(col, item)
                </div>
            </td>
        }
        @if (ShowExtendButtons)
        {
            <td>
                <div class="table-cell">
                    <div class="btn-group">
                        @if (ShowDefaultButtons)
                        {
                            @if (ShowEditButton)
                            {
                                <Button Size="Size.ExtraSmall" OnClick="@(EventCallback.Factory.Create<MouseEventArgs>(this, e => ClickEditButton(item)))" Icon="fa fa-edit" Text="编辑" />
                            }
                            @if (ShowDeleteButton)
                            {
                                <PopConfirmButton Placement="Placement.Left" Size="Size.ExtraSmall"
                                                  Color="Color.Danger" Icon="fa fa-remove" Text="删除"
                                                  CloseButtonText="取消" Content="确认要删除选中的所有行吗？"
                                                  ConfirmButtonColor="Color.Danger" ConfirmButtonText="删除"
                                                  OnBeforeClick="@(new Func<Task<bool>>(() => ClickDeleteButton(item)))"
                                                  OnConfirm="@(new Func<Task>(DeleteAsync))" />
                            }
                        }
                        @RowButtonTemplate?.Invoke(item)
                    </div>
                </div>
            </td>
        }
    </RenderTemplate>;
}
